<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>博客详情页</title>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/blog_detail.css">
    <!-- 引入 editor.md 的依赖 -->
    <link rel="stylesheet" href="editor.md/css/editormd.min.css" />
    <script src="js/jquery.min.js"></script>
    <script src="editor.md/lib/marked.min.js"></script>
    <script src="editor.md/lib/prettify.min.js"></script>
    <script src="editor.md/editormd.js"></script>
    <script src="js/logout.js"></script>
    <script src="js/countart.js"></script> 
    
</head>

<body>
    <!--导航栏-->
    <div class="nav">
        <!--头像-->
        <img src="css/cat.jpg" alt="">
        <span>博客系统</span>
        <!--使用空白元素，进行占位-->
        <div class="spaner">
            <span> </span>
        </div>
        <a href="blog_list.html">主页</a>
        <span id="element" style="display: none;">
        <a href="blog_add.html">写博客</a>
        <a href="myblog_list.html">个人列表页</a>
       </span>
        <a id="loginEment" href="blog-login.html">登录</a>
    </div>
    <!--中间的内容页-->
    <div class="container">
        <!--左边页面-->
        <div class="left">
            <div class="card">
                <img src="css/cat.jpg" alt="">
                <h3 id="author2"></h3>
                <a href="#">github地址</a>
                <div class="counter">
                    <span>文章</span>
                    <span>分类</span>
                </div>
                <div class="counter">
                    <span id="artsum"></span>
                    <span>2</span>
                </div>
            </div>
        </div>
        <!-- 右侧内容详情 -->
        <div class="right">
            <div class="blog-content">
                <!--博客标题-->
                <h3 id="title"></h3>
                <div class="data">
                    作者：
                    <span id="author"></span> &nbsp;&nbsp;&nbsp;
                    阅读量：
                    <span id="rcount"></span> &nbsp;&nbsp;&nbsp;
                    发布时间：
                    <span id="updatetime"></span> &nbsp;&nbsp;&nbsp;
                </div>
                <div id="content" style="opacity: 80%;">
                </div>
            </div>
        </div>
    </div>
    <script src="js/urltools.js"></script>
    <script type="text/javascript">
        var id= getParamByKey("id");
        var editormd;
        function initEdit(md){
            editormd=editormd.markdownToHTML("content",{
                markdown: md,
            });
        }
        function islogin(){
            jQuery.ajax({
                url:"user/islogin",
                type:"post",
                data:{},
                success:function(res){
                    if(res.code==200&&res.data==1){
                        //已经成功登录
                        jQuery("#loginEment").hide();
                        jQuery("#element").show();
                    }else{
                        jQuery("#loginEment").show();
                        jQuery("#element").hide();
                    }
                }
            });
        }
        islogin();
        function getDetail(){
            if(id==null||id<=0||id==undefined){
                alert("参数有误");
                return false;
            }
            //给后端传递数据
            jQuery.ajax({
                url:"/art/getDetail",
                type:"post",
                data:{
                    "id":id
                },
                success: function(res){
                    if(res.code==200&&res.data.id>0){
                        //显示正文
                        jQuery("#title").html(res.data.title);
                        jQuery("#author").html(res.data.username);
                        jQuery("#author2").html(res.data.username);
                        jQuery("#rcount").html(res.data.rcount);
                        jQuery("#updatetime").html(res.data.updatetime);
                        initEdit(res.data.content);
                    }else{
                        alert("操作失败，请重新操作");
                    }
                }
            });
        }
        getDetail();
        function addRcount(){
            jQuery.ajax({
                url:"art/addRcount",
                type:"post",
                data:{
                    "id":id
                },
                success: function(){
                }
            })
        }
        addRcount();   
        function artsum(){
        jQuery.ajax({
        url:"art/countArt",
        type:"post",
        data:{},
        success:function(res){
            jQuery("#artsum").html(res.data);
         }
        });
        } 
        artsum();
    </script>
</body>

</html>